import React, { Component } from "react";
import Card from "../../components/Card/Card";
import "./home.less";

export default class Home extends Component {
  state = { farmland: [], todayOrders: [] };
  getFarmland = async () => {
    const res = await this.http("Farmland", { language: "ZH" });
    this.setState({
      farmland: res.data,
    });
  };
  getOrders = async () => {
    const res = await this.http("Home/SealRecord");
    this.setState({
      todayOrders: res.data,
    });
  };
  farmlandRender = () => {
    return this.state.farmland.map((item) => {
      return (
        <Card title={item.name} key={item.id} bgColor="#FA6E5F">
          <div style={{ fontSize: "36px" }}>{item.used + "/" + item.total}</div>
        </Card>
      );
    });
  };
  todayOrdersRender = () => {
    return this.state.todayOrders.map((item, i) => {
      return (
        <Card title={item.poolName} key={i} bgColor="#FA6E5F">
          <div style={{ fontSize: "36px" }}>{item.capacity}</div>
        </Card>
      );
    });
  };
  componentDidMount() {
    this.getFarmland();
    this.getOrders();
  }
  render() {
    return (
      <div>
        <div className="title">矿机总量</div>
        {this.farmlandRender()}
        <div className="title">今日销量</div>
        {this.todayOrdersRender()}
      </div>
    );
  }
}
